<template>
	<view class="uni-stat--x " :style="{'background-color': Tipcolor }">
		<view class="Main-text">{{TipText}}</view>:
		<view class="Data_text">{{DataText+'9999'}}</view>
	</view>


</template>

<script>
	import EchartsVue from '../functions/Echarts.vue';
	export default {
		components: {
			EchartsVue
		},
		data() {
			return {
				_color: '#ed6b60',
				piecharts: [{
						value: 1048,
						name: 'Search Engine'
					},
					{
						value: 735,
						name: 'Direct'
					}
				]
			}
		},
		props: {
			decorationcolor: {
				type: String,
				required: true
			},
			Tipcolor: {
				type: String,
				required: true
			},
			TipText: {
				type: String,
				required: true
			},
			DataText: {
				type: String,
				required: true
			}
		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	.uni-stat--x {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: flex-start;
		width: 100%;
		height: 200rpx;
		border-radius: 10px;
		border-color: #99a9bf;
		background-color: #ffffff;
		
	}

	.dark_deep {
		background-color: #99a9bf;
	}

	.decoration {
		width: 9px;
		height: 9px;
		margin-right: 4px;
		border-radius: 50%;

		top: 20%;
		left: 10%;
		transform: translate(-50%, -50%);
		position: relative;
	}

	.demo-uni-row {
		margin-bottom: 0px;

		// 组件在小程序端display为inline
		// QQ、抖音小程序文档写有 :host，但实测不生效
		// 百度小程序没有 :host
		/* #ifdef MP-TOUTIAO || MP-QQ || MP-BAIDU */
		display: block;
		/* #endif */
	}

	.demo-uni-col {
		height: 20px;
		border-radius: 5px;
	}

	.Main-text {
		font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, SimSun, sans-serif;
		font-size: 14px;
		font-weight: 400;
		color: #3a3a3a;
	}

	.Data_text {
		font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, SimSun, sans-serif;
		font-size: 21px;
		margin-left: 15rpx;
		color: #3a3a3a;
	}
</style>